/* This file has global styles, which apply to all. Add page specific styles to specific stylesheets - e.g. login.css */
:root {
    /* Brand specific colours - This is the only place we should have colour codes - everywhere else, we should refer to these variables */
    --mcdonalds-red: #DB0007;
    --mcdonalds-red-low-opacity: #DB000750;
    --mcdonalds-gold: #FFBC0D;
    --mcdonalds-gold-low-opacity: #FFBC0D50;
    --mcdonalds-white: #FFFFFF;
    --mcdonalds-black: #000000;
    --mcdonalds-grey: #F2F2F2;
    /* Globals - using as per Bootstrap 5.3, so when this is released we can make use of it - https://getbootstrap.com/docs/5.3/customize/color/ */
    --bs-body-bg: var(--mcdonalds-white);
    --bs-body-color: var(--mcdonalds-black);
    --bs-secondary-bg: var(--mcdonalds-grey);
    --bs-secondary-color: var(--mcdonalds-black);
    --bs-tertiary-bg: var(--mcdonalds-gold);
    --bs-tertiary-color: var(--mcdonalds-black);
    --bs-primary: var(--mcdonalds-white);
    --bs-primary-text: var(--mcdonalds-black);
    /* Globals - our own font size variables */
    --mcdonalds-body-size: 1.13rem;
    --mcdonalds-h1-size: 38px;
    --mcdonalds-h1-size-inner: 38px;
    --mcdonalds-h1-mobile-size: 27px;
    --mcdonalds-h1-login-size: 38px;
    --mcdonalds-h1-login-size-mobile: 27px;
    --mcdonalds-h2-size: 27px;
    --mcdonalds-h3-size: 24px;
    --mcdonalds-h4-size: 21px;
    --mcdonalds-h5-size: 18px;
    --mcdonalds-h6-size: 16px;
    --mcdonalds-footer-size: 1.13rem;
    --mcdonalds-validation-size: 14px;
    /* Globals - our own specific settings */
    --mcdonalds-border-radius: 30px;
    --mcdonalds-button-radius: 4px;
}


/* In the below, we should only use the global color variables above */
/* ---------- 1 - Global ---------- */

/*fonts*/
@font-face {
    font-family: 'Speedee Bold';
    src: url(fonts/Speedee_W_Bd.woff) format('woff'), url(fonts/Speedee_W_Bd.woff2) format('woff2');
    font-weight: 700;
}

@font-face {
    font-family: 'Speedee Regular';
    src: url(fonts/Speedee_W_Rg.woff) format('woff'), url(fonts/Speedee_W_Rg.woff2) format('woff2');
    font-weight: 400;
}

body, p, legend {
    font-family: 'Speedee Regular', sans-serif;
    font-size: var(--mcdonalds-body-size);
    line-height: 1.43rem;
    color: var(--bs-body-color);
}

span {
    font-family: 'Speedee Regular', sans-serif;
}

h1 {
    font-size: var(--mcdonalds-h1-size-inner);
    font-family: 'Speedee Bold', sans-serif;
    line-height: 42px;
    color: var(--bs-body-color);
    margin-bottom: 40px !important;
}

@media only screen and (max-width: 991px) {
    h1 {
        font-size: var(--mcdonalds-h1-mobile-size);
        line-height: 33px;
    }
}

.mcdonalds-home h1 {
    text-align: center !important;
}

h2 {
    font-size: var(--mcdonalds-h2-size);
    line-height: 33px;
    font-family: 'Speedee Bold', sans-serif;
    color: var(--bs-body-color);
    background-color: var(--mcdonalds-gold) !important;
    display: inline-block !important;
    padding-left: 6px;
    padding-right: 6px;
    padding-bottom: 3px;
    padding-top: 1px;
}

h3 {
    font-size: var(--mcdonalds-h3-size);
    line-height: 30px;
    font-family: 'Speedee Bold', sans-serif;
    color: var(--bs-body-color);
}

h4 {
    font-size: var(--mcdonalds-h4-size);
    line-height: 27px;
    font-family: 'Speedee Bold', sans-serif;
    color: var(--bs-body-color);
}

h5 {
    font-size: var(--mcdonalds-h5-size);
    line-height: 24px;
    font-family: 'Speedee Bold', sans-serif;
    color: var(--bs-body-color);
}

h6 {
    font-size: var(--mcdonalds-h6-size);
    line-height: 22px;
    font-family: 'Speedee Bold', sans-serif;
    color: var(--bs-body-color);
}

/*text*/
/*links*/
a {
    color: var(--mcdonalds-red) !important;
}

#dnn_ContentPane a:hover {
    text-decoration: none !important;
}

#dnn_ContentPane a {
    text-decoration: underline;
}

/*bullet point size
ul li::marker {
    font-size: 12px;
}*/

/*background*/
@media only screen and (min-width: 992px) {
    main {
        background-image: url('images/McDonalds_FWC_artwork.svg');
        background-repeat: repeat !important;
        background-size: cover;
    }
}

/*page content width*/
@media only screen and (min-width: 992px) and (max-width: 1400px) {
    .ps-4 {
        padding-left: 4rem !important;
    }
    .pe-4 {
        padding-right: 4rem !important;
    }
    .ps-5 {
        padding-left: 9rem !important;
    }
    .pe-5 {
        padding-right: 9rem !important;
    }
    .ps-2 {
        padding-left: 10rem !important;
    }
    .pe-2 {
        padding-right: 10rem !important;
    }
}

@media only screen and (min-width: 1401px) and (max-width: 1919px) {
    .ps-4 {
        padding-left: 10rem !important;
    }
    .pe-4 {
        padding-right: 10rem !important;
    }
    .ps-5 {
        padding-left: 18.4rem !important;
    }
    .pe-5 {
        padding-right: 18.4rem !important;
    }
    .ps-2 {
        padding-left: 19.3rem !important;
    }

    .pe-2 {
        padding-right: 19.3rem !important;
    }
}

@media only screen and (min-width: 1920px) {
    .ps-4 {
        padding-left: 18rem !important;
    }

    .pe-4 {
        padding-right: 18rem !important;
    }
    .ps-5 {
        padding-left: 26.7rem !important;
    }

    .pe-5 {
        padding-right: 26.7rem !important;
    }
    .ps-2 {
        padding-left: 27.2rem !important;
    }

    .pe-2 {
        padding-right: 27.2rem !important;
    }
}

@media only screen and (max-width: 699px) {
    .ps-4 {
        padding-left: 1.2rem !important;
    }

    .pe-4 {
        padding-right: 1.2rem !important;
    }
    .ps-5 {
        padding-left: 2.4rem !important;
    }

    .pe-5 {
        padding-right: 2.4rem !important;
    }
}

@media only screen and (min-width: 700px) and (max-width: 991px) {
    .ps-4{
        padding-left: 2.4rem !important;
    }

    .pe-4 {
        padding-right: 2.4rem !important;
    }
    .ps-5 {
        padding-left: 3.45rem !important;
    }

    .pe-5 {
        padding-right: 3.45rem !important;
    }

}

/*navigation*/
/*@media only screen and (min-width: 992px) {
    .navbar .d-flex.flex-md-column.w-100.h-100 {
        transform: translate(0, 35%) !important;
    }
}*/

.navbar {
    justify-content: space-between;
}

.navbar-toggler {
    padding: 0px;
}

/*navigation and language*/
@media only screen and (max-width: 991px) {
    .navbar-nav .dropdown-menu, li.nav-item.dropdown {
        float: right;
        text-align: right;
    }
    /*.language-object{
        padding-top: 20px !important;
    }*/
    .navbar-toggler {
        background-color: unset !important;
        padding: 0px !important;
    }
    .navbar-toggler-icon {
        width: 2em;
        height: 2em;
    }
    .navbar-dark .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    }
}

@media only screen and (min-width: 992px) {
    .navbar-nav .dropdown-menu, li.nav-item.dropdown {
        float: unset;
        text-align: unset;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1589px) {
    .nav-item.dropdown:nth-child(3) a.nav-link.dropdown-toggle, li.nav-item.dropdown a:nth-child(4) {
        white-space: break-spaces !Important;
    }
}

@media only screen and (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        margin: 0px !important;
        border-radius: var(--mcdonalds-button-radius) !Important;
    }
}

    /*no-nav logo navigation*/
    @media only screen and (max-width: 549px) {
        .no-nav .justify-content-between {
            justify-content: unset !important;
            display: block !important;
        }
    }


/*header*/
header, header .container {
    background-color: var(--bs-primary);
    padding-left: 0px;
    padding-right: 0px;
    z-index: 9;
}

    header {
        border-bottom: solid 10px var(--mcdonalds-gold);
    }

    @media only screen and (max-width: 575px) {
        header .container {
            padding-left: 15px;
            padding-right: 15px;
        }
    }

    header a {
        text-decoration: none !important;
    }

    /*logo*/
.navbar-brand img, .inner-logo {
    padding: 12px 0px;
}

.navbar-brand {
    padding-bottom: 0px;
}

    /*home page hero photo*/
@media only screen and (min-width: 992px) {
    #mcdonalds-home-hero {
        background-image: url('images/McDonalds_Home.jpg');
        background-repeat: no-repeat !important;
        background-size: cover;
        height: 270px !important;
    }
    header {
        padding-top: 21px !important;
        padding-bottom: 21px !important;
    }
}

@media only screen and (max-width: 991px) {
    #mcdonalds-home-hero-m {
        background-image: url('images/McDonalds_Home.jpg');
        background-repeat: no-repeat !important;
        background-size: cover;
        height: 208px !important;
        background-position: 20%;
    }
    header {
        padding-top: 20px !important;
        padding-bottom: 15px !important;
    }
}

    /*footer*/
    @media only screen and (max-width: 991px) {
        .footer .at-ft-txt {
            padding-top: 0px !important;
            padding-bottom: 10px;
            padding-left: 0px;
            padding-right: 0px;
        }
        .footer {
            padding-top: 15px !important;
            padding-bottom: 15px !important;
        }
    }

    .footer {
        background-color: var(--bs-tertiary-bg);
        padding-top: 10px;
        padding-bottom: 10px;
    }

        .footer a, .footer p {
            color: var(--bs-tertiary-color);
            padding-right: unset;
        }

        .footer a {
            text-decoration: none !important;
            color: var(--bs-body-color) !important;
        }

        .footer p {
            margin-top: 0px !important;
        }

        .footer a:hover {
            text-decoration: underline !important;
        }

    @media only screen and (max-width: 991px) {
        .justify-content-between {
            display: block !important;
        }

        div.col-sm.gx-0 {
            text-align: center !important;
        }
    }

    /*buttons*/
button, .btn, .btn-primary, .btn .btn-primary, a.btn.btn-primary, #checkoutButton {
    background-color: var(--bs-tertiary-bg) !important;
    color: var(--bs-tertiary-color) !important;
    border-radius: var(--mcdonalds-button-radius) !important;
    border: none;
    text-transform: uppercase;
    padding: 10px 40px !important;
    letter-spacing: 2px;
    font-family: 'Speedee Bold', san-serif;
    text-decoration: none !important;
}

    .btn-secondary {
        background-color: var(--bs-secondary-bg) !important;
        color: var(--bs-secondary-color) !important;
    }

    span[onclick="removeFilter(this); return false;"] {
        margin-bottom: 30px !important;
    }

    .btn-secondary:hover {
        background-color: var(--mcdonalds-black) !important;
        color: var(--mcdonalds-white) !important;
    }

button:hover,.button:hover, #checkoutButton:hover, .btn:hover, .btn .btn-primary:hover, .btn-primary:active, .btn-primary:focus {
    background-color: var(--mcdonalds-gold-low-opacity) !important;
    color: var(--bs-tertiary-color) !important;
    text-decoration: none;
}

        .btn-primary:active:focus {
            box-shadow: none;
        }

    /*tables*/
    td {
        
        padding: 10px !important;
    }

tr.tickettabletr td {
    color: var(--bs-primary) !important;
    font-family: 'Speedee Regular';
    font-size: var(--mcdonalds-body-size) !important;
    line-height: 1.43rem !important;
}

    /*acordion buttons*/
button.accordion-button h2, h2.accordion-header {
    font-size: unset !Important;
    line-height: unset !Important;
    color: unset !Important;
    background-color: unset !important;
    display: unset !important;
    padding-left: unset !Important;
    padding-right: unset !Important;
    padding-bottom: unset !Important;
}

.accordion-item h2 {
    margin-bottom: 0px;
}

.accordion-button.collapsed:hover, .accordion-button:not(.collapsed):hover {
    background-color: var(--mcdonalds-gold-low-opacity) !important;
}

.accordion-button.collapsed {
    color: var(--bs-body-color) !important;
    background-color: var(--bs-tertiary-bg) !important;
}

.accordion-button:not(.collapsed) {
    background-color: var(--mcdonalds-gold-low-opacity) !important;
}

    button.accordion-button {
        border-radius: 0px !important;
        text-transform: inherit !important;
    }

.accordion-item:first-of-type {
    padding-top: 0px;
}

.accordion-item:last-of-type {
    padding-bottom: 0px;
    margin-bottom: 10px;
}

    .accordion-item:last-of-type .accordion-button.collapsed {
        border-radius: 0px;
    }

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}
    .accordion-button::after {
        margin-left: 15px !important;
    }

.accordion-button:focus {
    border-color: var(--bs-body-color);
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--bs-body-color);
}

.accordion-item {
    border: none;
    margin-bottom: 20px;
}

button.accordion-button.collapsed, .accordion-button:not(.collapsed) {
    font-size: var(--mcdonalds-h4-size);
    line-height: 1.43rem;
}

    /*table link colours*/
    tr: nth-child(even) a {
    color: var(--mcdonalds-red);
    text-decoration: none;
}

        tr:nth-child(even) a:hover, tr:nth-child(even) a span:hover {
            text-decoration: underline;
        }

    tr:nth-child(odd) a:hover, tr:nth-child(odd) a span:hover {
        text-decoration: underline;
    }

    tr:nth-child(odd) a:hover, tr:nth-child(even) a:hover {
        text-decoration: none;
    }

    /*buttons*/
    a.btn.btn-default:nth-child(odd):before, tfoot a.btn.btn-default:nth-child(odd):before {
        content: none;
    }

tr:nth-child(odd) .btn, tr:nth-child(even) .btn, #crossButton {
    background-color: var(--mcdonalds-gold) !important;
    color: var(--bs-body-color) !important;
    text-decoration: none !important;
    padding: 5px 10px !important;
    font-family: 'Speedee Regular', san-serif;
    text-decoration: 0px !important;
}

a.btn.btn-default {
    background-color: var(--mcdonalds-gold) !important;
    color: var(--bs-body-color) !important;
    text-decoration: none !important;
    padding: 5px 10px !important;
    font-family: 'Speedee Regular', san-serif;
    text-decoration: 0px !important;
}

    a.btn.btn-default:hover, .modal-content #popupButton:hover {
        background-color: var(--mcdonalds-gold-low-opacity) !important;
    }

.modal-content .btn.btn-default:hover, .modal-content #crossButton:hover {
    background-color: var(--mcdonalds-gold-low-opacity) !important;
}

/*tr:nth-child(odd) .btn:hover, tr:nth-child(even) .btn:hover, #crossButton:hover {
        background-color: var(--mcdonalds-red-low-opacity) !important;
        text-decoration: none !important;
    }*/

/*table footer*/
tfoot tr, tfoot tr:nth-child(even), tfoot tr:nth-child(odd) span {
    background-color: var(--mcdonalds-grey) !important;
    color: var(--mcdonalds-white) !important;
    font-family: 'Speedee Bold' !important;
}

    /*forms*/
    .form-check-input.is-valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .form-check-label {
        color: var(--bs-body-color) !important;
    }

    .form-control.is-valid, .form-control.is-valid {
        border-color: unset !important;
    }

    .justify-content-end .mb-3 {
        margin-bottom: 0px !important;
    }

    #4ce9db19-ffec-4cfb-86a9-b27fefc62a8f {
        margin-bottom: 10px;
    }

    .formbx .row {
        --bs-gutter-x: 30px;
    }

    .mb-3 {
        margin-bottom: 0px !important;
    }

.form-control, .form-select {
    border-radius: var(--mcdonalds-button-radius);
    margin-bottom: 30px;
    color: var(--bs-body-color);
    border: 1px solid var(--bs-body-color);
}

        .form-control:focus {
            color: var(--bs-body-color);
        }

    .form-control.is-invalid, .form-control.is-invalid {
        border: 1px solid var(--mcdonalds-red);
    }

    .was-validated .form-check-input:invalid ~ .form-check-label {
        color: var(--bs-body-color);
    }

    .col-sm-8 .columns .content-pad .formbx {
        margin-bottom: 30px;
    }

    label {
        color: var(--bs-body-color);
    }

    .col-form-label {
        color: var(--bs-body-color);
        font-family: 'Speedee Regular', sans-serif;
    }

    .formbx span {
        color: var(--bs-body-color);
    }

    .formbx a {
        color: var(--mcdonalds-red);
    }

    .butbx .btn, .butbx [type=submit]:not(:disabled), button:not(:disabled) {
        color: var(--bs-body-color);
    }

    .container-fluid .container {
        padding-left: 0;
        padding-right: 0;
    }

input, #columnList, #comparisonList, .js-filter-logic, .js-filter-operator, select, textarea {
    border-radius: unset;
    margin-bottom: 10px;
    color: var(--bs-body-color);
    border: 1px solid var(--bs-body-color);
    border-radius: var(--mcdonalds-button-radius);
    font-size: var(--mcdonalds-body-size);
    line-height: 1.43rem;
    padding: .375rem .75rem .375rem .75rem;
}

#cartTable input {
    width: 50%;
    display: block;
}

#cartTable btn:hover {
    background-color: var(--mcdonalds-gold-low-opacity) !important;
}

#columnList, #comparisonList, .js-filter-logic, .js-filter-operator {
    margin-bottom: 30px;
}

    /*form radio buttons*/
.form-check {
    display: flex !important;
    flex-wrap: wrap;
    padding-left: 0px !important;
}

        .form-check .form-check-input {
            min-width: 16px;
            float: none;
            padding: 0px;
            margin-right: 10px;
            margin-left: 0px !important;
            border: 1px solid var(--bs-body-color);
        }

        .form-check .form-check-label {
            flex: 1;
        }

.form-check-input:checked {
    background-color: var(--bs-body-color);
    border-color: var(--bs-body-color);
}

    div#guestRegistrationModal .form-check-input:checked {
        background-color: var(--bs-body-bg);
    }

    div#guestRegistrationModal ul.list0 {
        margin-left: 20px;
    }

    .form-check-input {
        border: none;
    }

        /*check boxes*/
        .form-check-input[type=checkbox] {
            margin-right: 5px;
            border: 1px solid var(--bs-body-color);
        }

    /*form validation*/
.validation-summary-errors {
    color: var(--mcdonalds-red) !important;
    font-size: var(--mcdonalds-validation-size);
    font-family: 'Speedee Bold';
    margin-top: 0px;
}

#firstNameError, #surNameError, #salutationError, .modalerror {
    font-size: var(--mcdonalds-validation-size);
    color: var(--mcdonalds-red);
    font-family: 'Speedee Bold';
}

.invalid-feedback, .was-validated :invalid ~ .invalid-feedback {
    font-size: var(--mcdonalds-validation-size);
    color: var(--mcdonalds-red);
    font-family: 'Speedee Bold';
}

    .was-validated :invalid ~ .invalid-feedback {
        margin-top: 10px;
    }

    .form-select.is-invalid:not([multiple]):not([size]) {
        margin-bottom: 10px;
        border: 1px solid var(--mcdonalds-red);
    }

    .formbx .form-control.is-invalid, .was-validated .form-control:invalid {
        margin-bottom: 10px;
    }


    /*dropdown menu*/
.dropdown-menu {
    border: 0px solid transparent;
    border-radius: 0px !important;
    background-color: var(--bs-body-bg);
    min-width: 8.6rem !important;
}

.nav-item.dropdown.rotated {
    background-color: var(--bs-body-bg);
}

.dropdown-toggle::after {
    color: var(--bs-body-color) !important;
}

@media only screen and (min-width: 992px) and (max-width: 1233px) {
    .dropdown-menu {
        min-width: 7.45rem !important;
    }
}

@media only screen and (min-width: 1234px) and (max-width: 1589px) {

    .dropdown-menu {
        min-width: 8.6rem !important;
    }
}

@media only screen and (min-width: 1234px) and (max-width: 1339px) {
    .dropdown-menu {
        min-width: 8.65rem !important;
    }
}

@media only screen and (min-width: 1340px) and (max-width: 1588px) {
    .dropdown-menu {
        min-width: 9.63rem !important;
    }
}

@media only screen and (min-width: 1589px) {
    .dropdown-menu {
        min-width: 10.7rem !important;
    }
}

@media (max-width: 991px) {
    ul.navbar-nav li {
        padding-left: 0px !important;
        padding-bottom: 0px !important;
    }

    ul.dropdown-menu li:nth-last-child(1) {
        padding-right: 0px !important;
    }

    ul.dropdown-menu li {
        padding-right: 0px !important;
    }
}

@media (min-width: 1340px) and (max-width: 1463px) {
    ul .navbar-nav li {
        padding-right: 10px;
        padding-left: 10px;
    }
}

@media (min-width: 991px) {
    ul.dropdown-menu li {
        padding-right: 15px !important;
        padding-left: 15px !important;
        border-right: none !important;
    }

    ul.navbar-nav li {
        padding-right: 15px;
        padding-left: 15px;
    }
}

/*dropdown menu specific*/
ul.dropdown-menu li {
    padding-right: 15px;
    padding-left: 15px;
}

    ul.dropdown-menu li:nth-last-child(1) {
        padding-right: 15px;
        padding-left: 15px;
    }

.dropdown-menu li {
    padding-bottom: 10px;
}

    .dropdown-menu li:nth-last-child() {
        padding-bottom: 0px;
    }

@media only screen and (max-width: 991px) {
    .dropdown-menu {
        border-radius: unset;
    }
}
    /*menu*/
    .navbar {
        align-items: baseline;
    }

    ul.navbar-nav li {
        flex: 1 1 auto !important;
    }

        ul.navbar-nav li:nth-last-child(1) {
            border-right: none !important;
        }

    @media only screen and (min-width: 992px) {
        ul.navbar-nav li {
            border-right: 1px solid var(--mcdonalds-gold) !important;
        }
    }

    .navlink {
        transition: unset !important;
    }

.navbar-nav, .navbar-dark .navbar-nav .nav-link {
    text-transform: uppercase !important;
    color: var(--bs-body-color) !important;
}

    @media only screen and (min-width: 991px) and (max-width: 1105px) {
        .navbar-nav, .navbar-dark .navbar-nav .nav-link {
            font-size: 0.85rem !important;
            line-height: 1.15rem !important;
            letter-spacing: 2.5px !important;
        }
    }

@media only screen and (min-width: 1106px) and (max-width: 1924px) {
    .navbar-nav, .navbar-dark .navbar-nav .nav-link {
        font-size: 0.93rem !important;
        line-height: 1.15rem !important;
        letter-spacing: 2.5px !important;
    }
}


@media only screen and (min-width: 1925px) {
    .navbar-nav, .navbar-dark .navbar-nav .nav-link {
        font-size: 1rem !important;
        line-height: 1.25rem !important;
        letter-spacing: 3px !important;
    }
}

    a.nav-link span {
        font-family: 'Speedee Bold' !important;
    }

        a.nav-link span:hover {
            color: var(--mcdonalds-red) !important;
        }


    @media (max-width: 767px) {
        .navbar {
            align-items: center;
        }
    }

    @media (min-width: 992px) and (max-width: 1022px) {
        ul.navbar-nav li {
            padding-right: 5px;
            padding-left: 5px;
        }
    }

    @media (min-width: 1023px) and (max-width: 1067px) {
        ul.navbar-nav li {
            padding-right: 10px;
            padding-left: 10px;
        }
    }

    ul.navbar-nav li:nth-last-child(1) {
        padding-right: 0px;
    }


    ul.navbar-nav li a {
        padding-right: 0px !important;
        padding-left: 0px !important;
    }

    ul.navbar-nav li {
        align-self: self-end;
    }

    .pb-2 {
        padding-bottom: 1rem !important;
    }

    .pt-2 {
        padding-top: 1rem !important;
    }

    .badge {
        background-color: var(--mcdonalds-red) !important;
        padding: .20em .65em;
    }

    a.nav-link span.badge:hover {
        color: #ffffff !important;
    }


    /* ---------- 2 - ModRegistrationFormC  ---------- */
    .ModRegistrationFormC button:hover, .ModRegistrationFormC btn:hover, ModRegistrationFormC .btn-primary:hover {
        background-color: var(--bs-tertiary-bg) !important;
        color: var(--bs-tertiary-color) !important;
    }

    .ModRegistrationFormC .btn-secondary:hover {
        background-color: var(--mcdonalds-gold-low-opacity) !important;
    }

    .ModRegistrationFormC .regitem, .ModRegistrationFormC .reggrptle {
        list-style-type: none;
    }

    .ModRegistrationFormC .btn-primary {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }

    .ModRegistrationFormC .btn-secondary {
        margin-bottom: 30px !important;
    }

    .ModRegistrationFormC .reggrptle a {
        color: var(--mcdonalds-red) !important;
        text-decoration: none !important;
        font-size: 1rem !important;
        line-height: 1.25rem !important;
        font-family: 'Speedee Regular' !important;
    }

    .ModRegistrationFormC .regitem a {
        color: var(--mcdonalds-red) !important;
        text-decoration: none !important;
    }

    .ModRegistrationFormC .content-pad.content-image .regitem a {
        font-family: 'Speedee Regular';
        font-size: 16px !important;
        line-height: 20px !important;
        text-decoration: none !important;
    }

    .ModRegistrationFormC li.regitem, .ModRegistrationFormC li.reggrptle {
        padding-bottom: 20px;
    }

    .ModRegistrationFormC .reggrptle a:active, .ModRegistrationFormC .content-pad.content-image .regitem a:hover, .ModRegistrationFormC .regitem a:hover, .ModRegistrationFormC .regitem a:active {
        text-decoration: none !important;
        font-size: 1rem !important;
        line-height: 1.25rem !important;
        font-family: 'Speedee Regular' !important;
        color: var(--mcdonalds-red) !important;
    }

    .ModRegistrationFormC .formbx a:hover {
        color: var(--mcdonalds-red);
        text-decoration: underline !important;
    }

    .ModRegistrationFormC .mb-3 {
        padding-bottom: 20px !important;
    }

        .ModRegistrationFormC .mb-3:nth-last-child(2) {
            padding-bottom: 0px !important;
        }

    .ModRegistrationFormC .butbx {
        padding-top: 20px;
    }

    .formbx .form-check {
        padding-bottom: 20px !important;
    }

    .formbx li.form-check {
        padding-bottom: unset !important;
    }

    .formbx .butbx .btn-secondary {
        margin-right: 20px !important;
    }

    .ModRegistrationFormC label {
        font-family: 'Speedee Bold';
    }

    .ModRegistrationFormC .form-label {
        font-family: 'Speedee Bold' !important;
    }

    .ModRegistrationFormC label.form-check-label {
        font-family: 'Speedee Bold', san-serif !important;
        display: inline;
    }

    #guestRegistrationModal .form-label {
        font-size: 16px;
    }

    .ModRegistrationFormC .form-check {
        padding-left: 0px;
        margin-bottom: 0px;
    }

    .ModRegistrationFormC .radcheck {
        color: var(--bs-body-color);
        font-family: 'Speedee Bold', san-serif;
    }

    .ModRegistrationFormC .form-check:nth-last-child() {
        padding-bottom: 30px;
    }

    .ModRegistrationFormC .row {
        justify-content: space-between;
    }

    @media only screen and (min-width: 576px) {
        .ModRegistrationFormC .col-sm-4.content-pad {
            width: 31.33333333%;
        }

        .ModRegistrationFormC .col-sm-8.content-pad {
            width: 64.66666667%;
        }
    }

    @media only screen and (max-width: 575px) {
        .col-sm-4.content-pad.content-image {
            margin-bottom: 20px !important;
        }
    }

    .ModRegistrationFormC li.regitem {
        word-break: break-word;
    }

    .ModRegistrationFormC .was-validated .form-check-input:invalid {
        border: 1px solid var(--mcdonalds-red);
    }

    /* ---------- 3 - ModChangeGuestC ---------- */
    .ModChangeGuestC .col-sm-8 .btn {
        margin-top: 10px;
        margin-bottom: 30px;
    }

    .ModChangeGuestC .form-control.is-invalid {
        margin-bottom: 10px;
    }

    /* ---------- 4 - ModDeclineC ---------- */
    .ModDeclineC .invalid-feedback {
        margin-bottom: 0px;
    }

    .ModDeclineC button:hover, .btn:hover {
        background-color: var(--mcdonalds-gold-low-opacity) !important;
    }

    /* ---------- 5 - MRSVPPanel ---------- */
    .RSVPPanel .mb-3 {
        padding-bottom: 20px !important;
    }

        .RSVPPanel .mb-3:nth-last-child(2) {
            margin-bottom: 0px !important;
        }

    .RSVPPanel input[type="text"] {
        width: 100%;
    }

    .RSVPPanel button {
        padding: 12px 12px !important;
    }

    /* ---------- 6 - Reg Panel---------- */
    .regitem a, .reggrptle {
        font-size: var(--mcdonalds-body-size);
        line-height: 1.25rem;
        text-decoration: none;
        color: var(--mcdonalds-red);
    }

        .reggrptle a {
            font-family: 'Speedee Regular', san-serif;
            text-decoration: none;
        }

        .regitem a:hover {
            text-decoration: underline;
        }

        .list0, .reggrptle a, .reggrptle::marker, .regitem a {
            color: var(--bs-body-color);
        }

    .list0 {
        padding: 0px !important
    }

    .modal-content .row {
        padding-bottom: 20px;
    }

    .js-filter-criterion:nth-child(1) {
        padding-top: 0px;
    }

    .js-filter-criterion {
        padding-top: 20px;
    }

    #scrolling_table_1 {
        max-height: 100% !Important;
        margin-top: 30px;
    }

        #scrolling_table_1 td {
            font-size: 15px;
        }

            #scrolling_table_1 td[data-bind="text:packageType"], #scrolling_table_1 td[data-bind="text:businessUnit"], #scrolling_table_1 td[data-bind="text:programme"], #scrolling_table_1 td[data-bind="text:wave"], #scrolling_table_1 td[data-bind="text:status"] {
                text-wrap: balance;
                word-break: auto-phrase;
            }

            #scrolling_table_1 td.fixed.freeze_vertical.scrolling_table_1 {
                background: var(--mcdonalds-black) !important;
            }



#fix {
    height: 60vh !important;
}

    #deleteGuestBtn {
        display: none !important;
    }

    .scrolly_table {
        white-space: normal !important;
    }

    div.d-flex.flex-md-column.w-100.h-100 {
        align-items: self-end !important;
        justify-content: right;
    }

    /* ---------- 9 - ModPulseGuestRegistrationC ---------- */
    .ModPulseGuestRegistrationC #filters .row {
        --bs-gutter-x: 30px;
        margin-bottom: 0px;
    }

    #filters {
        margin-top: 30px;
    }

    .ModPulseReportC, .ModPulseUploadGuestListC, #filter-978, #filter-982 {
        background-color: unset !important;
    }

    .ModPulseUploadInviteeListC button {
        margin-top: 10px !important;
    }

    input[type=file] {
        margin-left: 12px !important;
        margin-right: 20px !important;
        max-width: fit-content !important;
    }

    @media only screen and (min-width: 576px) {
        .modal-dialog {
            max-width: 900px !important;
        }
    }

    /*forms - /Guest/Registration page*/
    #filter-978 {
        margin-bottom: 40px;
    }

    /*buttons*/
    .ModPulseGuestRegistrationC [type=button], #filter-982 #filterAdd, #filter-982 #btnFind {
        background-color: var(--bs-tertiary-bg) !important;
        color: var(--bs-tertiary-color) !important;
        border-radius: var(--mcdonalds-button-radius);
        border: none;
        padding: 12px 12px;
    }

    .ModPulseReportC .btn:hover, .ModPulseUploadGuestListC .btn:hover, #filterAdd:hover, #btnFind:hover {
        background-color: var(--mcdonalds-gold-low-opacity) !important;
    }

    #filterAdd {
        margin-right: 20px;
    }

    #filterAdd, #btnFind {
        font-size: 16px !important;
        margin-top: 30px;
    }

    /* ---------- 10 - ModMyPackagesC ---------- */
    .ModMyPackagesC {
        padding: 0px;
        padding-top: 30px;
    }

    .ModPulsePackageStatusAggregationC {
        overflow-x: auto;
    }

    .ModMyPackagesC li div {
        margin-bottom: 30px;
    }

    .modal-body {
        padding: 30px;
    }

    .ModMyPackagesC ul {
        list-style-type: none;
    }

    .ModMyPackagesC a {
        color: var(--mcdonalds-red);
        text-decoration: none !important;
    }

        .ModMyPackagesC a:hover {
            text-decoration: underline !important;
        }

    /*sign-up page validation*/
    span.dnnFormRequired:after {
        content: "*";
        display: inline-block;
        margin: 0 0 0 5px;
        color: var(--bs-body-color);
        font-size: 16px;
        line-height: 1em;
        font-family: 'Speedee Bold', san-serif;
    }

    /*empty panes*/
    .DNNEmptyPane {
        padding: 0px !important;
        margin: 0px !important;
    }

    body.personabar-visible .DNNEmptyPane, body.personabar-visible .headerPane.DNNEmptyPane {
        display: unset !important;
    }

    body.personabar-visible #dnn_BannerPaneM, body.personabar-visible #dnn_BannerPane {
        display: unset !important;
    }

    /*mcdonalds artwork*/
    .mcdonalds-photo img {
        width: 100% !important;
        height: auto !important;
        border-radius: 25px !important;
    }

    @media only screen and (max-width: 599px) {
        .col.mcdonalds-photo.text-start, .col.mcdonalds-photo.text-end {
            text-align: center !important;
            min-width: 100% !important;
            min-height: auto !important;
        }

        .col.mcdonalds-photo.text-center {
            padding-top: 30px !important;
            padding-bottom: 30px !important;
        }
    }

    .mcdonalds-full-photo {
        width: 100% !important;
        height: auto !important;
    }

    /*photo banners*/
    /*div.col.home {
        background-color: var(--bs-body-bg);
    }

    div.col.registration {
        background-color: var(--bs-body-bg);
    }*/
    /*#dnn_BannerPane, #dnn_BannerPaneM {
        padding: 0px;
        position: relative;
    }

        #dnn_BannerPane img {
            float: right;
        }

    @media only screen and (max-width: 1199px) {
        #dnn_BannerPane img {
            transform: translate(11%,0);
        }
    }

    @media only screen and (min-width: 1401px) {
        #dnn_BannerPane h1, #dnn_BannerPane span {
            padding-left: 6rem;
        }
    }

    @media only screen and (max-width: 1400px) {
        #dnn_BannerPane h1, #dnn_BannerPane span {
            padding-left: 2.5rem;
        }
    }

    @media only screen and (min-width: 992px) {
        #dnn_BannerPane h1 {
            position: absolute;
            top: 16%;
            padding-right: 40px;
            z-index: 10;
            font-family: 'Speedee Bold';
            color: var(--);
            font-size: var(--mcdonalds-h1-size);
            line-height: 58px;
        }
    }

    @media only screen and (min-width: 992px) {
        #dnn_BannerPane span {
            position: absolute;
            padding-right: 40px;
            z-index: 10;
            font-family: 'Speedee Bold';
            font-size: 20px;
            line-height: 24px;
            letter-spacing: 10px;
            top: 50%;
            color: var(--);
        }
    }

    @media only screen and (min-width: 992px) {
        #dnn_BannerPaneM {
            display: none;
        }
    }*/
    /*photo banner - mobile*/
    /*@media only screen and (max-width: 991px) {
        #dnn_BannerPane {
            display: none;
        }
    }

    @media only screen and (max-width: 768px) {
        #dnn_BannerPaneM h1, #dnn_BannerPaneM span {
            padding-left: 20px !important;
        }
    }

    @media only screen and (min-width: 769px) and (max-width: 991px) {
        #dnn_BannerPaneM h1, #dnn_BannerPaneM span {
            padding-left: 40px !important;
        }
    }

    @media only screen and (max-width: 991px) {
        #dnn_BannerPaneM {
            margin-bottom: 5%;
        }
    }

    @media only screen and (max-width: 991px) {
        #dnn_BannerPaneM h1 {
            position: relative;
            padding-left: 20px;
            padding-right: 40px;
            z-index: 10;
            font-family: 'Speedee Bold';
            font-size: 40px;
            line-height: 44px;
            letter-spacing: 10px;
            color: var(--);
        }

        #dnn_BannerPaneM img {
            float: right;
            margin-bottom: 20px;
            width: 100% !important;
            height: 100% !important;
            /*object-fit: contain;
            object-position: right;
        }

        #dnn_BannerPaneM span {
            font-family: 'Speedee Bold';
            font-size: 18px;
            line-height: 22px;
            letter-spacing: 10px;
            position: relative;
            padding-left: 20px;
            padding-right: 20px;
            display: block;
        }

        .at-ban-text {
            position: inherit;
            background-color: var(--);
        }
    }
*/
    /*back to top*/
    a#backToTop {
        text-decoration: none !important;
        padding: 12px 16px 12px 16px !important;
        background-color: var(--mcdonalds-red) !important;
        color: var(--mcdonalds-white) !important;
        font-family: 'Speedee Bold';
        font-size: 15px !important;
        position: fixed !important;
        z-index: 1000 !important;
        display: none;
        bottom: 0;
        right: 0;
    }

        a#backToTop:hover {
            background-color: var(--mcdonalds-black) !important;
            color: var(--mcdonalds-white) !important;
        }

    /*skip button*/
    a.visually-hidden-focusable {
        background-color: var(--mcdonalds-red) !important;
        color: var(--mcdonalds-white) !important;
        padding: 10px 15px !important;
        position: absolute;
        z-index: 1000;
        border-radius: var(--mcdonalds-button-radius);
        font-family: 'Speedee Bold' !important;
        font-size: 15px;
        text-decoration: none !important;
        outline: 2px solid var(--mcdonalds-red) !important;
        outline-offset: 3px;
        top: 7px !important;
        left: 5px !important;
        position: absolute !important;
        z-index: 1000 !important;
    }